
owl.define('Bt', {
    template: owl.xml`<button> bt component</button>`,
    setup() {
        console.log('Bt setup');
    }
});
owl.define('test', {
    template: owl.xml`<t t-if="props.visible">
    <div>child component:</div>
    <Bt t-on-click="edit">click me</Bt>
    <div>click times:<t t-esc="state.value"/></div>
    </t>
    <t t-else="">
    b
    </t>`,
    edit(){
        this.state.value ++;
        console.log('edit');
    },
    setup() {
        this.state = owl.useState({ value: 0 });
        console.log('test setup');
    }
});
owl.define('test', {
    extends: 'test',
    edit(){
        console.log('edit override');
        this.callSuper(...arguments);
    },
    setup() {
        this.callSuper(...arguments);
        console.log('test setup override');
    }
});

const app = new owl.App(owl.components['test'], { props: {visible:true} });
app.mount(document.body);